<template>
    <!-- 常用地点   v-if="!!commonPlace.length" -->

<div class='commonMechine dd-fixed-top'  >
  <div class='item dd-row dd-h-center dd-v-center'
        v-if="!commonPlaceBool" v-for="(item,index) in commonPlace" :key="index"  @click='gowhere' >
  <!-- <div class='item dd-row dd-h-center dd-v-center'  > -->
    <div class='icon'>
    <img class='iconImg' src='../../assets/img/loca.png'/>
    </div>
    <div>
      {{item}}
    </div>
    <div>
      <!-- {{item.placeAddress}} -->
    </div>
  </div>

  <div class='title dd-row dd-h-center'   @click="commonMechineSH" >
    <!-- <div>常用地点</div> -->
    <div class="commonPlaceDiv">
        <img class='commonPlaceImg' src='@/assets/img/commonMechine.png' alt="常用地点"/>    
    </div>
  </div>
  
</div>
</template>
<script>
export default {
  data() {
    return {
      commonPlaceBool: false,
      commonPlace: [123, 456, 534]
    };
  },
  methods: {
    gowhere() {
      console.log("gowhere");
      // /my/myOrder/myOrderDetails
     this.$router.push('/scanGoods')
    },
    // 显示与隐藏
    commonMechineSH() {
      this.commonPlaceBool = !this.commonPlaceBool;
    }
  }
};
</script>


<style scoped>
.commonMechine {
  z-index: 51;
}

.commonMechine .item {
  background-color: rgba(255, 255, 255, 0.8);
  padding: 4pt 0;
  color: #444;
  font-size: 12pt;
  border-bottom: 1pt dotted #444;
}

.commonMechine .item .icon {
  width: 12pt;
  height: 12pt;
  margin-right: 5pt;
}

.commonMechine .item .icon .iconImg {
  width: 12pt;
  height: 12pt;
}
/* 常用设备的 */
.commonMechine .commonPlaceDiv {
  width: 90pt;
  /* background: red; */
}
.commonMechine .commonPlaceDiv .commonPlaceImg {
  width: 90pt;
}
</style>

